<template>
  <div>
    <grandson1 v-bind="$attrs" v-on="$listeners"></grandson1>
    <grandson2 v-bind="$attrs"></grandson2><br />
    child1:
    <input type="text" @input="ToEmit" :value="text" placeholder="child1输入" />
    <p>text:{{ text }}</p>
  </div>
</template>
<script>
import grandson1 from './grandson1.vue'
import grandson2 from './grandson2.vue'
export default {
  name: 'childOne',
  props: ['msg', 'text'],
  emits: ['childOneInputEvent'],
  components: { grandson1, grandson2 },
  data: function () {
    return {
      name: 'child1Component'
    }
  },
  created() {
    // console.log(this.msg)
  },
  mounted() {
    console.log(this.msg)
    console.log(this.$attrs)
    console.log('child1_$listeners__', this.$listeners)
  },
  methods: {
    ToEmit(e) {
      console.log(e)
      const result = this.$emit('childOneInputEvent', e.target.value)
      console.log('检查this.$emit的返回值:', result, result === this)
    }
  },
  activated: {},
  deactivated: {}
}
</script>
<style lang="less" scoped></style>
